<%@ page language="java"
	import="com.jfinal.plugin.activerecord.Record,java.util.List"
	contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	response.setHeader("Pragma", "No-cache");
	response.setHeader("Cache-Control", "no-cache");
	response.setDateHeader("Expires", -10);

	List<Record> warnTypeList = (List<Record>) request.getAttribute("warn_type");
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<!-- Tell the browser to be responsive to screen width -->
<meta
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
	name="viewport">
<!-- Bootstrap 3.3.5 -->
<link href="//cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css"
	rel="stylesheet">
<link
	href="//cdn.bootcss.com/font-awesome/4.4.0/css/font-awesome.min.css"
	rel="stylesheet">
<!-- DataTables -->
<link rel="stylesheet"
	href="../../plugins/datatables/dataTables.bootstrap.css">
<!-- Theme style -->
<link rel="stylesheet" href="../../dist/css/AdminLTE.min.css">
<!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->

<link rel="stylesheet" href="../../dist/css/skins/_all-skins.min.css">
<link rel="stylesheet" href="../../index.css">
<link rel="stylesheet" href="../../device/style.css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
<style type="text/css">
th, td {
	white-space: nowrap;
}

div.dataTables_wrapper {
	
	width: 100%;
	margin: 0 auto;
}
</style>
</head>

<body>
	<div>
		<div class="bg-custom">
			<!-- Content Header (Page header) -->
			<section class="content-header">
				<h1>告警查询</h1>
				<ol class="breadcrumb">
					<li><a href="#"><i class="fa fa-home"></i> 首页</a></li>
					<li class="">告警管理</li>
					<li class="active">告警查询</li>
				</ol>
			</section>


			<div class="row">
				<div class="col-md-12 col-lg-12 padding-right-12">
					<div class="dashboard-panel margin-right-15 ">
						<div class="row device_dash_panel">
							<!--  -->
							<div class="row titleStyle">
								<div class="col-xs-12 padding-left-0">
									<img src="../../mainpage/img/blue_line.png" />
									<lable>&nbsp;&nbsp;告警记录列表</lable>
								</div>

							</div>

							<div>
								<div class="padding-lr-30 ">
									<form id="queryForm_warn"
										class="form-horizontal padding-top-10">
										<div class="">
											<div class="col-md-3 ">
												<div class="form-group">
													<label for="air_code_query_air"
														class="control-label col-xs-3 padding-0">告警类型: </label>
													<div class=" col-xs-9">
														<select class="form-control input-sm " name="warn_type"
															placeholder="请选择告警类型">
															<option value="" selected></option>
															<%
																for (int i = 0; i < warnTypeList.size(); i++) {
																	Record vo = warnTypeList.get(i);
															%>
															<option value="<%=vo.get("warn_type_id")%>"><%=vo.get("name")%></option>
															<%
																}
															%>

														</select>
													</div>
												</div>
											</div>
											<div class="col-md-3 ">
												<div class="form-group">
													<label for="air_code_query_air"
														class="control-label col-xs-3 padding-0">告警等级: </label>
													<div class=" col-xs-9">
														<select class="form-control input-sm " name="warn_level"
															placeholder="请选择告警等级">
															<option value="" selected></option>
															<option value="0">预警</option>
															<option value="1">1级告警</option>
															<option value="2">2级告警</option>
														</select>
													</div>
												</div>
											</div>
											<div class="col-md-3 ">
												<div class="form-group">
													<label for="air_code_query_air"
														class="control-label col-xs-3 padding-0 ">开始时间: </label>
													<div class=" col-xs-9">
														<input class="form-control input-sm xlaydate"
															id="begin_time" name="begin_time" placeholder="请选择开始时间">
														</input>
													</div>
												</div>
											</div>
											<div class="col-md-3 ">
												<div class="form-group">
													<label for="air_code_query_air"
														class="control-label col-xs-3 padding-0 ">结束时间: </label>
													<div class=" col-xs-9">
														<input class="form-control input-sm xlaydate"
															id="end_time" name="end_time" placeholder="请选结束始时间"></input>
													</div>
												</div>
											</div>
											<!-- 
											<div class="col-md-4">
												<div class="form-group">
													<div class="col-xs-8" align="right">
														<button type="button" class="btn btn-primary  margin-5"
															onclick="queryFlowDatas()">查询</button>
														<button type="button" class="btn btn-default  margin-5"
															onclick="resetFlowForm()">重置</button>
													</div>
												</div>
											</div>
											 -->
										</div>
										<div>
											<div class="col-md-3">
												<div class="form-group">
													<label for="air_code_query_air"
														class="control-label col-xs-4 padding-0 ">告警确认状态:
													</label>
													<div class=" col-xs-8">
														<select class="form-control input-sm " name="is_clear"
															placeholder="请选择告警等级">
															<option value="" selected></option>
															<option value="0">未确认</option>
															<option value="1">已确认</option>
														</select>

													</div>
												</div>
											</div>
											<div class="col-md-9">
												<div class="form-group">
													<div align="right">
														<button type="button" class="btn btn-success  margin-5"
															onclick="confirmWarn()">告警确认</button>
														<button type="button" id="queryForm_btn"
															class="btn btn-primary   margin-5" onclick="queryForm()">告警查询</button>
														<button type="button" class="btn btn-default  margin-5"
															onclick="resetForm()">条件重置</button>

													</div>
												</div>
											</div>


										</div>
									</form>
								</div>
							</div>
							<div>
								<div class="row padding-lr-30 ">
									<table id="warn_table"
										class="table table-condensed dashboard-panel-table ">
										<thead>
											<tr>
												<th>选项</th>
												<th>告警流水ID</th>
												<th>告警类型</th>
												<th>告警对象类型</th>
												<th>告警对象</th>
												<th>告警名称</th>
												<th>告警等级</th>
												<th>告警次数</th>
												<th>是否已确认</th>
												<th>告警发生时间</th>
												<th>告警确认人</th>
												<th>告警确认时间</th>
												<th>告警设备归属组织</th>
											</tr>
										</thead>
									</table>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>



		</div>

		<div class="modal fade" id="confirmWarnModel" tabindex="-1"
			role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
			align="center">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">告警确认提示</h4>
					</div>
					<div class="modal-body" align="center">
						<div id="successAlert_air" class="alert alert-success form-group"
							role="alert" hidden="true" align="center">
							<strong>确认成功！</strong>
						</div>
						<div id="failedAlert_air" class="alert alert-danger form-group"
							role="alert" hidden="true" align="center">
							<strong>确认失败！</strong>
						</div>
						<div id="promptContent_air">是否确认选中告警记录？</div>

					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭
						</button>
						<button id="confirm_btn" type="button" class="btn btn-primary"
							onclick="confirmWarnMsg()">确认</button>
					</div>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal -->
		</div>

		<div class="modal fade" id="alertModal_air" tabindex="-1"
			role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
			align="center">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
					</div>
					<div class="modal-body">
						<div id="selAlert_air" class="alert alert-danger form-group"
							style="margin-top: 10px" role="alert" align="center">
							<strong>请选择记录进行删除！</strong>
						</div>
					</div>
				</div>
			</div>
		</div>

	</div>




	<!-- ./wrapper -->
	<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
	<script src="//cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
	<script src="../../plugins/datatables/jquery.dataTables.min.js"></script>
	<script src="../../plugins/datatables/dataTables.bootstrap.min.js"></script>
	<script src="//cdn.bootcss.com/echarts/2.2.7/echarts.js"></script>
	<script src="../../plugins/laydate/laydate.js"></script>
	<script src="../../plugins/jtopo/jtopo-0.4.8-min.js"></script>
	<script src="../../plugins/jtopo/jtopo-util.js"></script>

	<script src="../../plugins/common/common-util.js"></script>
	<script src="../../plugins/jsutil/MapUtil.js"></script>




	<script src="../../warnmanager/js/main.js"></script>

	<!-- page script -->
	<script type="text/javascript">
		var DAY_FLOW = null;
		var MONTHO_FLOW = null;
		var echarts = null;
		$(function() {
			initTable();

			$('.xlaydate').each(function() {
				var id = $(this).attr('id');
				console.log(id);
				laydate({
					elem : '#' + id,
					event : 'focus',
					istime : true,
					format : 'YYYY-MM-DD hh:mm:ss',
					choose : function() {
						$('#' + id).change();
						$('#' + id).blur();
					}
				});
			});
		});
	</script>
</body>
</html>
